<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/common/taglibs.jsp" %>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html>
<html lang="en">
	<head>
		<%@ include file="/common/common-css.jsp" %>
		<%@ include file="discovery-css.jsp" %>
		<%@ include file="discovery-editor.jsp" %>
		<style>
		.load_bg{background:#000;opacity:0.1;left:0px;top:0px;position:fixed;height:100%;width:100%;overflow:hidden;z-index:10000;}
		.load_img{left:50%;top:180px;position:fixed;height:50px;overflow:hidden;z-index:20000;}
		</style>
	</head>
<body class="no-skin">
	<div  class="load_bg" style="display:none;" ></div>
  <img src="http://img.xmiles.cn/commentloading.gif" class="load_img" style="display:none"/>
	<div class="page-content">
	
			
			<ul class="nav nav-pills discovery-nav" role="tablist">
			 <li role="presentation" class="active"><a>写新文章</a></li>
			  <li role="presentation"><a href="${ctx}/discovery/article/listArticle.action?pageno=1&pagesize=25">文章管理</a></li>
			 
			</ul>
			<hr/>
		<div class="page-content-area">
			
			<div class="row">
				<div class="col-xs-12 col-sm-12 widget-container-col">
					<div class="widget-box widget-color-blue">
						<!-- #section:custom/widget-box.options.collapsed -->
						<div class="widget-body">
							<div class="widget-main" style="min-height:1336px;" >
								<div class="row" id="prices">
									<div class="col-xs-12 col-md-12">
									  <form id="discovery-add-form" name="" action="${ctx}/discovery/article/saveArticle.action?operate=${addorUpdateVO.operate}&id=${addorUpdateVO.dateVo.id}" method="post" enctype="multipart/form-data">
									    <div class="forpreview">


									      <div class="form-group">
									          <label for="title">样式</label>
									          <select class="form-control discovery-input" name="style" id="style" value="${style}">
											   <option value="2" >web页面内嵌链接</option>
											   <option value="3">native+web页面</option>
											   <option value="1">旧版详情页面</option>
											</select>
									      </div><br>
										  <div class="form-group autoTxtCount">
											<label for="title">标题</label>
											<input type="text" name="addorUpdateVO.dateVo.title" class="form-control text" id="title" value="${addorUpdateVO.dateVo.title}" required="required" maxlength="50">
											<span class="tips">50/50</span>
										  </div>
										  <div style="text-align: left" class="headimg">
										  <label for="from">商品封面</label>
										   <img id="pre-bigimg" src="${addorUpdateVO.dateVo.img}" onerror="javascript:this.src='http://img.xmiles.cn/img/void.png'"; style= "max-height:250px;"  required="required"/>
										  </div><br>
										  
										  <div class="form-group discovery-inline mr10">
											<label for="coverimg">封面（建议图片比例：2:1）</label>
											<input type="file" name="addorUpdateVO.img" class="discovery-input-file" id="coverimg"/>
											<input type="hidden" id="coverimghid" value="${addorUpdateVO.dateVo.img}"/>
										  </div><br>
										  
										  <div class="form-group discovery-inline autoTxtCount">
											<label for="from">商品来源</label>
											<input type="text" name="addorUpdateVO.dateVo.source" class="form-control discovery-input text" id="from" value="${addorUpdateVO.dateVo.source}" maxlength="7" required="required">
											<span class="tips">7/7</span>
										  </div><br>
										  
										  <div class="form-group discovery-inline autoTxtCount">
											<label for="fromurl">价格</label>
											<input type="text" name="addorUpdateVO.dateVo.price" class="form-control discovery-input text" id="price" value="${addorUpdateVO.dateVo.price}"  maxlength="200" required="required">
											<span class="tips">200/200</span>
										  </div><br>
										  
										  <div id="detailpricediv" class="form-group discovery-inline autoTxtCount">
											<label for="fromurl">详细价格</label>
											<input type="text" name="addorUpdateVO.dateVo.detailprice" class="form-control discovery-input text" id="detailprice" value="${addorUpdateVO.dateVo.detailprice}"  maxlength="200">
											<span class="tips">200/200</span>
										  </div><br>
										  
										  <div id="worthdiv" class="form-group discovery-inline"  style="width:25%">
											<label for="fromurl">值</label>
											<input type="text" name="addorUpdateVO.dateVo.worth" class="form-control discovery-input text" id="worth" value="${addorUpdateVO.dateVo.worth}" style="width:80%" >
								
										  </div>
										  
										  <div id="noworthdiv" class="form-group discovery-inline " style="width:25%">
											<label for="fromurl">不值</label>
											<input type="text" name="addorUpdateVO.dateVo.noworth" class="form-control discovery-input text" id="noworth" value="${addorUpdateVO.dateVo.noworth}" style="width:75%">
								
										  </div><br>

										  <div id="postagediv" class="form-group discovery-inline">
											<label for="fromurl">是否包邮</label>
											<input type="checkbox" onchange="postagechange()"  id="postage" style="width:50%" >
											<input type="hidden" id="postagehid" name="addorUpdateVO.dateVo.postage" value="${addorUpdateVO.dateVo.postage}"/>
										  </div>

										  <div id="salesnumdiv" class="form-group discovery-inline">
											<label for="fromurl">已售人数</label>
											<input type="text" name="addorUpdateVO.dateVo.salesnum" class="form-control discovery-input text" id="salesnum" value="${addorUpdateVO.dateVo.salesnum}" style="width:50%" >
										  </div>

										  <div id="realpaydiv" class="form-group discovery-inline">
											<label for="fromurl">实付</label>
											<input type="text" name="addorUpdateVO.dateVo.realpay" class="form-control discovery-input text" id="realpay" value="${addorUpdateVO.dateVo.realpay}" style="width:50%" >
										  </div>

										  <div id="expiretimediv" class="form-group discovery-inline">
											<label for="fromurl">失效时间</label>
											<div class="col-sm-8">
												<div class="input-daterange input-group">
													<input type="text" data-date-format="yyyy-mm-dd hh:ii" class="date-picker input-sm form-control" style="padding-left:0px" value="${addorUpdateVO.dateVo.expiretime}" name="addorUpdateVO.dateVo.expiretime">
												</div>
											</div>
										  </div>
										  
										 <!--  <div class="form-group discovery-inline mr10">
											<label for="coverimg">封面（建议图片比例：2:1）</label>
											<input type="file" name="addorUpdateVO.img" class="discovery-input-file" id="coverimg"/>
											<input type="hidden" id="coverimghid" value="${addorUpdateVO.dateVo.img}"/>
											<input type="file" name="addorUpdateVO.img1" class="discovery-input-file" id="coverimg1"/>
											<input type="hidden" id="coverimghid1" value="${addorUpdateVO.img1FileName}"/>
											<input type="file" name="addorUpdateVO.img2" class="discovery-input-file" id="coverimg2"/>
											<input type="hidden" id="coverimghid2" value="${addorUpdateVO.img2FileName}"/>
										  </div>
										 <div class="form-group discovery-inline">
											<label for="promote">选择推广标签</label>
											<select class="form-control discovery-input" name="addorUpdateVO.dateVo.tag" id="promote" value="${addorUpdateVO.dateVo.tag}">
											   <option value="" >无</option>
											   <option value="1">热</option>
											   <option value="2">荐</option>
											   <option value="3">推广</option>
											</select>
										  </div>-->
										  
										  
										 
										  
										  </div><!--forpreview end-->
										  <!--<div class="preview">
											  <div id="preview-detail" class="preview-detail">
												<img id="pre-bigimg" src="${addorUpdateVO.dateVo.img}" onerror="javascript:this.src='http://img.xmiles.cn/img/void.png'";  required="required"/>
												<h3 id="preview-h3">${addorUpdateVO.dateVo.title}</h3>
											  </div>
											  <div id="preview-list" style="padding:0" class="preview-list">
												<h4 id="preview-h4">${addorUpdateVO.dateVo.title}</h4>
												<img id="pre-smallimg" src="${addorUpdateVO.dateVo.img}" onerror="javascript:this.src='http://img.xmiles.cn/img/void.png'"; style="width:100px;height:66px" required="required"/>
												<img id="pre-smallimg1" src="${addorUpdateVO.img1FileName}" onerror="javascript:this.src='http://img.xmiles.cn/img/void.png'";  style="width:100px;height:66px" required="required"/>
												<img id="pre-smallimg2" src="${addorUpdateVO.img2FileName}" onerror="javascript:this.src='http://img.xmiles.cn/img/void.png'";  style="width:100px;height:66px" required="required"/>
												<div class="clear"></div>
											  </div>
											</div> /.预览-->
											
										  <div class="form-group autoTxtCount" style="width:900px;">
											<label for="summary">摘要</label>
											<textarea name="addorUpdateVO.exVO.summary" class="form-control discovery-input-summary text" id="summary" required="required" maxlength="200">${addorUpdateVO.exVO.summary}</textarea>
											<span class="tips">200/200</span>
										  </div>
 
										<textarea id="editor_id" name="addorUpdateVO.exVO.html"  style="width:900px;height:500px;">
										${addorUpdateVO.exVO.html}
										</textarea>
										
										<div id="sourcetypediv" class="form-group discovery-inline" style="width:900px;margin-top:20px">
											<label for="promote">购买链接</label><br>
											<select id="sourceselect" class="form-control discovery-input" name="addorUpdateVO.dateVo.sourcetype"  value="${addorUpdateVO.dateVo.sourcetype}" style="width:20%">
											   <option value="" >选择商品来源</option>
											   <option value="1">天猫精选</option>
											   <option value="2">淘宝商品</option>
											   <option value="3">亚马逊中国</option>
											   <option value="4">苏宁易购</option>
											   <option value="5">唯品会</option>
											   <option value="6">当当网</option>
											   <option value="7">易讯网</option>
											   <option value="8">国美在线</option>
											   <option value="9">1号店</option>
											   <option value="10">京东商城</option>
											</select>
											<input id="sourselurl" type="text" name="addorUpdateVO.dateVo.sourceurl" class="form-control discovery-input text"  value="${addorUpdateVO.dateVo.sourceurl}" style="display: inline-block ;width:100% ">
											<input id="hidurl" type="hidden" name="addorUpdateVO.dateVo.url" autocomplete="off" class="form-control discovery-input text"  value="${addorUpdateVO.dateVo.url}" style="display: inline-block ;width:100% ">
											<label for="promote">链接预览:</label>
											<a style="margin-left:5px" target="_blank"  id="urlpreview" href="${addorUpdateVO.dateVo.url}">${addorUpdateVO.dateVo.url}</a>
										 </div>
										<!--<div class="bannerfile" style="margin-top:20px;height: 250px;display:none;">
										   <div class="form-group discovery-inline">
											<label for="bannercoverimg">banner封面（建议图片比例：3:2）</label>
											<input type="file" name="banner" class="discovery-input-file" id="bannercoverimg" />
											<input type="hidden" id="bannerimghid" value="${bannerFileName}"/>
										  </div>
										  <div class="form-group discovery-inline autoTxtCount">
											<label for="bannertit">banner标题</label>
											<input type="text" name="bannerTitle" class="form-control discovery-input text" id="bannertit" value="${bannerTitle}" maxlength="50">
											<span class="tips">50/50</span>
										  </div>
										  <div class="banner-preview">
										    <img id="banner-preview-img" src="${bannerFileName}" onerror="javascript:this.src='http://img.xmiles.cn/img/void.png'"; required="required"/>
											<h3 id="banner-preview-h3">${bannerTitle}</h3>
										  </div>
										  <div class="form-group col-xs-12 col-sm-4 col-md-3 col-lg-3">
										  <label class="col-sm-4 control-label"  style="text-align:right"  for="sex">banner失效时间:</label>
											<div class="col-sm-8">
												<div class="input-daterange input-group">
													<input type="text" data-date-format="yyyy-mm-dd hh:ii" class="date-picker input-sm form-control" style="padding-left:0px" value="${bannerExpire}" name="bannerExpire">
												</div>
											</div>
										 </div>
										 </div>-->
										<div class="form-opera">
										 <div class="form-group col-xs-12 col-sm-4 col-md-3 col-lg-3">
											<label class="col-sm-4 control-label"  style="text-align:right"  for="sex">发布时间（定时发布）:</label>
											<div class="col-sm-8">
												<div class="input-daterange input-group">
													<input type="text" data-date-format="yyyy-mm-dd hh:ii" class="date-picker input-sm form-control" style="padding-left:0px" value="${addorUpdateVO.pubTime}" name="addorUpdateVO.pubTime">
												</div>
											</div>
										 </div>
											 <button type="button" class="btn btn-primary savepost">保存并发布</button>
											 <button type="button" class="btn btn-default savedraft" style="display:${display};margin-right:3px;">保存为草稿</button>
											 <button type="button" class="btn btn-default btnpreview">删除</button>
											<!-- <div class="checkbox discovery-inline-banner">
											   <input id="ifbanner-checkbox" type="checkbox" autocomplete="off" name=isBanner value="${isBanner}"/>
											   <label style="padding-left:0;" id="ifbanner" for="ifbanner-checkbox">设置为banner</label>	
											 </div>-->
										 </div>
										 
									  </form>
									</div>
								</div>

									
							</div><!-- /.widget-main -->
						</div><!-- /.widget-body -->
					</div><!-- /.widget-box -->
				</div><!-- /.col-sm-12 -->
			</div><!-- /.row -->        		
		
		
		</div><!-- /.page-content-area -->	
	</div><!-- /.page-content -->
	
	
<%@ include file="/common/common-js.jsp" %>
<%@ include file="maxlength.jsp" %>
<script>
	var urlGene = '${urlGene}';
	var urlGeneObj=JSON.parse(urlGene);
  $(function(){
    $('#title').bind('input propertychange', function() {
		$('#preview-h3,#preview-h4').text($('#title').val());
	});
	$('#bannertit').bind('input propertychange', function() {
		$('#banner-preview-h3').text($('#bannertit').val());
	});

	var sourceselectval = '${addorUpdateVO.dateVo.sourcetype}';
	if(sourceselectval != '')
	{
		var intval = parseInt(sourceselectval) + 1;
		$('#sourceselect').children("option:nth-child("+intval+")").attr('selected',true);
	}
	else
	{
		$('#sourceselect').children("option:nth-child(1)").attr('selected',true);
	}
	
	if(${style} == 2)
	{
       $('#style').children("option:nth-child(1)").attr('selected',true);
	}
	else if(${style} == 1)
	{
       $('#style').children("option:nth-child(3)").attr('selected',true);
	}
	else if(${style} == 3)
	{
       $('#style').children("option:nth-child(2)").attr('selected',true);
	}
	showcontrol(${style});
	var initpost = $('#postagehid').val();;
	if(initpost == '')
	{
       $('#postage').attr("checked",'true');
       $('#postagehid').val(1); 
	}
	else if(initpost == '1')
	{
       $('#postage').attr("checked",'true');
	}
	$('#sourselurl').bind('input propertychange',function(){
		var myurl = $('#sourselurl').val();
		var prefix = '';
		var suffix = '';
		for(var i = 0 ; i<urlGeneObj.length;i++)
		{
			if(myurl.indexOf(urlGeneObj[i].regs)>0)
			{
				if (typeof(urlGeneObj[i].prefix) != "undefined")
				{
					prefix = urlGeneObj[i].prefix;
				}
				
				if (typeof(urlGeneObj[i].suffix) != "undefined")
				{
					suffix = urlGeneObj[i].suffix;
				}
				
				myurl = change2mob(myurl,urlGeneObj[i].id);
				break;
			}
		}
	  	myurl = encodeURI(myurl);
//		var regS1 = new RegExp("\\:","g");
//		var regS2 = new RegExp("\\/","g");
//		myurl = myurl.replace(regS1,'%3A');
//		myurl = myurl.replace(regS2,'%2F');
		var sour = $('#sourceselect').val();
		var newurl =  prefix + myurl + suffix;
		$('#urlpreview').text(newurl);
		$('#urlpreview').attr('href',newurl)
		$('#hidurl').val(newurl);
	});
	
	
	
    //输入实时显示
//   var imgval = $('#headhid').val();
   var imgval1 = $('#coverimghid').val();
  /*  if(imgval==""){
      $("#head").attr("required","required");
    }*/
    if(imgval1==""){
      $("#coverimg").attr("required","required");
    }
    //判断图片是否存在
    // $('#style').on('change',function(){
    // 	var temp = $('#style').val();
    // 	if(temp == )
    // 	{

    // 	}

    // })
	$('.savepost').click(function(){
	    $(this).attr('type','submit');
	    $('#discovery-add-form').attr({action:ctx + '/discovery/article/saveArticle.action?operate=1&id=${addorUpdateVO.dateVo.id}',target:'_self'});
	    showLoading();
	   //  $(".load_bg").removeAttr("style");
		//$(".load_img").removeAttr("style");
	});
	$('.savedraft').click(function(){
	    $(this).attr('type','submit');
		$('#discovery-add-form').attr({action:ctx +'/discovery/article/saveArticle.action?operate=0&id=${addorUpdateVO.dateVo.id}',target:'_self'});
		showLoading();
	});
	$('.btnpreview').click(function(){
		  $.ajax({
						
						"type": "GET",
						"dataType": 'json',
						"url": ctx+'/discovery/article/deleteArticle.action?id=${addorUpdateVO.dateVo.id}',
						"success": function(resp){
							window.location.href=ctx + '/discovery/article/listArticle.action';
						},		
						"error": function(XMLHttpRequest, textStatus, errorThrown) {
						},
						"complete":function(XMLHttpRequest, textStatus){
							window.location.href=ctx +'/discovery/article/listArticle.action';
						},
										
				});
	    showLoading();
	});
	//提交按钮租
	var ifbanner = $('#ifbanner-checkbox').val();
	if(ifbanner==1){
		$('#ifbanner-checkbox').prop("checked",true);
		$('.bannerfile').show();
		$('#bannertit').attr('required','required');
		if($('#bannerimghid').val()=='')
			{
			    $('#bannercoverimg').attr('required','required');
			 }
	}else{
		$('#ifbanner-checkbox').prop("checked",false);
	}
	$('#ifbanner-checkbox').click(function(){
		if($('#ifbanner-checkbox').prop("checked")==true){
			$('#ifbanner-checkbox').val('1');
			//alert($('#ifbanner-checkbox').val());
			$('.bannerfile').slideDown();
			$('#bannertit').attr('required','required');
			if($('#bannerimghid').val()=='')
			{
			    $('#bannercoverimg').attr('required','required');
			 }
			
		}else{
			$('#ifbanner-checkbox').val('');
			//alert($('#ifbanner-checkbox').val());
			$('.bannerfile').slideUp();
			$('#bannercoverimg,#bannertit').attr('required',false);
		}
	});
	$('#style').change(function(){
	    var style = $('#style').val();
	    if(style == 1)
	    {
	      showcontrol(1);
	    }
	    else
	    {
	       showcontrol(2);
	    }
	    
	    
	});
	
	
//	$('#sourselurl').change(function(){
//		var myurl = $('#sourselurl').val();
//		var sour = $('#sourceselect').val();
//		var prefix = '';
//		var suffix = '';
//		if(sour == '1')
//		{
//			prefix = 'http://c.duomai.com/track.php?site_id=158499&aid=61&euid=&t=';
//			suffix='';
//		}
//		else
//		{
//		}
//		
//		var newurl =  prefix + myurl + suffix;
//		$('#urlpreview').val(newurl);
//		
//		
//		var file = this.files[0];
//		var r = new FileReader();
//		r.readAsDataURL(file);
//		$(r).load(function(){
//		$('#pre-smallimg2').attr('src',this.result);
//		});
	});
	
	function showLoading()
 {
	 if($('#title').val() == ''
	 ||$('#from').val() == ''
	 ||$('#price').val() == ''
	 ||$('#detailprice').val() == ''
	 ||$('#worth').val() == ''
	 ||$('#noworth').val() == ''
	 ||$('#summary').val() == ''
	 ||$('#sourselurl').val() == ''
	 )
	 {
	 	 return;
	 }
	 if($('#coverimghid').val() == ''
	 &&$('#coverimg').val() == '')
	 {
	 	return;
	}
	 
	  $(".load_bg").removeAttr("style");
		$(".load_img").removeAttr("style");
 };
 
 function change2mob(sorurl,regs)
 {
 	switch(regs)
 {
    case 1:
     sorurl = sorurl.replace('http://item.jd.com/','http://item.m.jd.com/product/');
    break;
    case 2:
     sorurl = sorurl.replace('http://item.yhd.com/item/','http://item.m.yhd.com/item/');
    break;
    case 3:
     sorurl = sorurl.replace('http://product.suning.com/','http://product.m.suning.com/product/');
    
    break;
    case 4:
     sorurl = sorurl.replace('http://product.dangdang.com/','http://m.dangdang.com/h5product/product.php?pid=');
     sorurl = sorurl.substring(0,sorurl.length-5);
    break;
    case 5:
     sorurl = sorurl.replace('http://item.gome.com.cn/','http://m.gome.com.cn/product-');
    break;
    case 6:
     var strs =sorurl.split('?');
     sorurl = strs[0];
     sorurl = sorurl.replace('http://item.yixun.com/item-','http://m.yixun.com/t/detail/?pid=');
     sorurl = sorurl.substring(0,sorurl.length-5);
    break;
    case 7:
    // sorurl = sorurl.replace('http://www.amazon.cn/dp/','http://www.amazon.cn/gp/aw/d/');
    break;
    case 8:
     sorurl = sorurl.replace('http://www.vip.com/detail','http://m.vip.com/product');
    break;
    case 9:
     sorurl = sorurl.replace('http://www.newegg.cn/','http://m.newegg.cn/');
    break;
    case 10:
     sorurl = sorurl.replace('http://detail.tmall.com/','http://detail.m.tmall.com/');
    break;
  }
  return sorurl;
}

function showcontrol(type)
{
	if(type != 1)
	{
        $('#detailpricediv,#worthdiv,#noworthdiv,.ke-container').hide();
        $('#postagediv,#salesnumdiv,#realpaydiv,#expiretimediv,#sourceselect').show();
	}
	else
	{
		$('#detailpricediv,#worthdiv,#noworthdiv,.ke-container').show();
        $('#postagediv,#salesnumdiv,#realpaydiv,#expiretimediv,#sourceselect').hide();
	}
}

function postagechange()
{
	
	if($('#postage').is(':checked'))
	{
		$('#postagehid').val('1');
	}
	else
	{
		$('#postagehid').val('0');
	}
}

</script>
<script type="text/javascript">
$(function(){
	$('#head').change(function(){
		var file = this.files[0];
		var r = new FileReader();
		r.readAsDataURL(file);
		$(r).load(function(){
		$('#previewhead').attr('src',this.result);
		});
	});
	$('#coverimg').change(function(){
		var file = this.files[0];
		var r = new FileReader();
		r.readAsDataURL(file);
		$(r).load(function(){
		$('#pre-bigimg,#pre-smallimg').attr('src',this.result);
		});
	});
	
	$('#coverimg1').change(function(){
		var file = this.files[0];
		var r = new FileReader();
		r.readAsDataURL(file);
		$(r).load(function(){
		$('#pre-smallimg1').attr('src',this.result);
		});
	});
	
	$('#coverimg2').change(function(){
		var file = this.files[0];
		var r = new FileReader();
		r.readAsDataURL(file);
		$(r).load(function(){
		$('#pre-smallimg2').attr('src',this.result);
		});
	});
	
	
	
	$('#bannercoverimg').change(function(){
		var file = this.files[0];
		var r = new FileReader();
		r.readAsDataURL(file);
		$(r).load(function(){
		$('#banner-preview-img').attr('src',this.result);
		});
	});
});


	//时间控件
	jQuery(function($) {
		$(".date-picker").datetimepicker({autoclose:true}).next().on(ace.click_event, function(){
					$(this).prev().focus();
		});
		
	});

</script>
</body>
</html>
